<template>
  <van-popup round position="bottom" v-model:show="show" :style="{ height:'46%'}">
    <van-date-picker
  v-model="currentDate"
  title="选择年月"
  :filter="filter"
  type="year-month"
  :formatter="formatter"
  :columns-type="['year', 'month']"
  @confirm="chooseMonth"
  @cancel="cancelChoose"
/>
  </van-popup>
</template>

<script setup>
import { ref } from 'vue';


const show=ref(false)
const date=new Date()
const currentDate=ref([date.getFullYear(),date.getMonth()+1])

const emits=defineEmits(['select',])  //是一个函数
// 暴露属性让父组件获取到

defineExpose({
  show
})

const formatter = (type, option) => {
      if (type === 'year') {
        option.text += '年';
      }
      if (type === 'month') {
        option.text += '月';
      }
      return option;
};

    
const chooseMonth=({selectedValues})=>{
  // console.log(selectedValues);
  show.value=false
  emits('select',selectedValues)   //往外发散这个emits
}

const cancelChoose=()=>{
  show.value=false
}


</script>

<style lang="less" scoped></style>